<template>
  <div class="main">
    <div class="w3l_main_grid">
      <div class="w3l_main_grid1">
        <div class="w3l_main_grid1_left">
          <img src="../assets/images/star.png" alt=" " class="img-responsive"/>
        </div>
        <div class="w3l_main_grid1_right">
          <div class="menu">
						<span class="menu-icon">
							<a href="#">
								<i></i>
								<i></i>
								<i></i>
							</a>
						</span>
            <ul class="nav1">

              <router-link to="/login" tag="li">
                <li>Log In</li>
              </router-link>
           <!--   <li><a href="${pageContext.request.contextPath}/register">Sign Up</a></li>-->

              <router-link to="/user-reg" tag="li">
                <li>Sign Up</li>
              </router-link>

              <router-link to="/setting" tag="li">
                <li>Setting</li>
              </router-link>


              <li>other</li>

            </ul>

          </div>
        </div>
        <div class="clear"></div>
        <div class="w3l_main_grid1_sub">
          <img src="../assets/images/1.png" alt=" " class="img-responsive"/>
          <h2>Meagan Fisher</h2>
        </div>
      </div>
      <div class="w3l_main_grid2">
        <div class="sap_tabs">
          <div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">
            <ul class="resp-tabs-list">
              <li class="resp-tab-item" aria-controls="tab_item-1" role="tab"><h2><span
                class="w3ls_figure"> </span></h2></li>
              <li class="resp-tab-item" aria-controls="tab_item-2" role="tab"><span
                class="w3ls_figure1"> </span></li>
              <li class="resp-tab-item" aria-controls="tab_item-3" role="tab"><span
                class="w3ls_figure2"> </span></li>
              <li class="resp-tab-item" aria-controls="tab_item-4" role="tab"><span
                class="w3ls_figure3"> </span></li>
              <div class="clear"></div>
            </ul>
            <div class="resp-tabs-container">
              <div class="tab-1 resp-tab-content" aria-labelledby="tab_item-1">
                <div class="wthree_tab_grid">
                  <h4>About Me</h4>
                  <p class="eget">Personality signature 1</p>
                  <p class="eget1"> Personality signature 2</p>
                  <div class="wthree_tab_grid_sub">
                    <div class="wthree_tab_grid_sub_left">
                      <h5>999</h5>
                      <p>Level of appearance</p>
                    </div>
                    <div class="wthree_tab_grid_sub_left">
                      <h5>213</h5>
                      <p>integral</p>
                    </div>
                    <div class="wthree_tab_grid_sub_left">
                      <h5>123</h5>
                      <p>Friend</p>
                    </div>
                    <div class="clear"></div>
                  </div>
                </div>
              </div>
              <div class="tab-2 resp-tab-content" aria-labelledby="tab_item-2">
                <div class="wthree_tab_grid">
                  <h4>Screen</h4>
                  <ol>
                    <li>mattis volutpat ante<span>Nulla eleifend nisi id quam interdum, id dictum urna viverra</span>
                    </li>
                    <li>dictum tincidunt sem
                      sed<span>Nulla eleifend nisi id quam interdum, id dictum urna viverra</span>
                    </li>
                    <li>Praesent sem quam<span>Nulla eleifend nisi id quam interdum, id dictum urna viverra</span>
                    </li>
                    <li>amet dignissim felis<span>Nulla eleifend nisi id quam interdum, id dictum urna viverra</span>
                    </li>
                    <li>dictum urna viverra<span>Nulla eleifend nisi id quam interdum, id dictum urna viverra</span>
                    </li>
                  </ol>
                </div>
              </div>
              <div class="tab-3 resp-tab-content" aria-labelledby="tab_item-3">
                <div class="wthree_tab_grid">
                  <h4>Remaining Sum</h4>
                  <div class="agile_activity_row">
                    <div class="agile_activity_img"><span>2017-06-25 10:00 PM</span></div>
                    <div class="agile_activity_img1">
                      <div class="agile_activity_sub">
                        <h5>1589-567=1022</h5>
                        <p>account : Physfo</p>
                      </div>
                    </div>
                    <div class="clear"></div>
                  </div>
                  <div class="agile_activity_row">
                    <div class="agile_activity_img"><span>2017-06-25 10:00 PM</span></div>
                    <div class="agile_activity_img1">
                      <div class="agile_activity_sub">
                        <h5>1022-22=1000</h5>
                        <p>account : 00270834763471</p>
                      </div>
                    </div>
                    <div class="clear"></div>
                  </div>
                  <div class="agile_activity_row">
                    <div class="agile_activity_img"><span>2017-06-25 10:00 PM</span></div>
                    <div class="agile_activity_img1">
                      <div class="agile_activity_sub">
                        <h5>1000-45=955</h5>
                        <p>account : Rocky</p>
                      </div>
                    </div>
                    <div class="clear"></div>
                  </div>

                </div>
              </div>
              <div class="tab-4 resp-tab-content" aria-labelledby="tab_item-4">
                <div class="wthree_tab_grid">
                  <h4>Contact</h4>
                  <ul class="wthree_tab_grid_list">
                    <li><img src="../assets/images/call.png" alt=" " class="img-responsive"/></li>
                    <li>Mobile<span>+123 234 4342</span></li>
                  </ul>
                  <ul class="wthree_tab_grid_list">
                    <li><img src="../assets/images/mail.png" alt=" " class="img-responsive"/></li>
                    <li>Mail Me<span><a href="mailto:info@example.com">info@example.com</a></span></li>
                  </ul>
                  <ul class="wthree_tab_grid_list">
                    <li><img src="../assets/images/address.png" alt=" " class="img-responsive"/></li>
                    <li>Address<span>123 Avenue, Dollar Street, NYC.</span></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>


      </div>
    </div>


    <div class="wthree_footer_copy">
      <p>Copyright &copy; 2016.Company name All rights reserved.</p>
    </div>

    <div class="dbgao"></div>
  </div>

</template>
<script>

  import HeaderView from '../components/Header.vue';
  import easy from '../assets/js/easyResponsiveTabs';

  export default{
    mounted(){
      this.start();
      this.toProfile();

    },
    methods: {
      start(){

        $("span.menu-icon").click(function () {
          $("ul.nav1").slideToggle(300, function () {
            // Animation complete.
          });
        });


        $('#horizontalTab').easyResponsiveTabs({
          type: 'default', //Types: default, vertical, accordion
          width: 'auto', //auto or any width like 600px
          fit: true   // 100% fit in a container
        });
        addEventListener("load", function () {
          setTimeout(hideURLbar, 0);
        }, false);
        function hideURLbar() {
          window.scrollTo(0, 1);
        }
      },
      toProfile(){
        var post = this;
        this.$http.jsonp(global.URL + "/toProfile", //跨域请求接口
          {
            params: {}
          }).then(function (response) {
          this.users = response.data;

          if (response.data == "0") {
            swal("OMG", "Please login!", "error");
            post.$router.replace({path: '/login'})
          } else {

          }
        }, function (error) {
          swal("OMG", "Please login!", "error");
          post.$router.replace({path: '/login'})
        });
      }
    },
    components: {

      HeaderView,


    }
  }
</script>
<style>

  @import '../assets/css/ltkj.css';
  @import '../assets/css/style.css';
</style>

